<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title>修改床位</title>
		<link rel="shortcut icon" href="img/logo.jpg">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<link href="css/bootstrap-responsive.css" rel="stylesheet" />
		<link href="css/bootstrap.css" rel="stylesheet" media="screen">
	</head>

	<body>
		<legend>床位修改</legend>

		<div class="container-fluid">
			<div class="row-fluid">
				<div class="span12">
					<ul class="breadcrumb">
						<li>
							<a href="#">主页</a> <span class="divider">/</span>
						</li>
						<li>
							<a href="#">床位管理</a> <span class="divider">/</span>
						</li>
						<li>
							<a href="http://127.0.0.1/view/sys_beds/beds.html#">床位详情</a> <span class="divider">/</span>
						</li>
						<li class="active">
							修改信息</a>
						</li>
					</ul>
				</div>
			</div>
		</div>

		<article>
			<form class="form-horizontal" @submit.prevent="modBedsEvt">
				<div class="control-group">
					<label class="control-label" for="inputEmail">床位编号：</label>
					<div class="controls">
						<input v-model="params.no" type="text" placeholder="编号">
					</div>
				</div>
				<div class="control-group">
					<label class="control-label">床位状态：</label>
					<div class="controls">
						<input v-model="params.state" type="text" placeholder="状态">
					</div>
				</div>

				<div class="control-group">
					<label class="control-label">床位详情：</label>
					<div class="controls">
						<input v-model="params.description" type="text" placeholder="详情信息">
					</div>
				</div>
				<div class="control-group">
					<div class="controls">
						<button class="btn" :disabled="actionBtnDisabled" @click="modOne">修改</button>
					</div>
				</div>
			</form>
		</article>

		<script src="../../common/axios.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../common/vue.js" type="text/javascript" charset="utf-8"></script>
		<script src="http://code.jquery.com/jquery.js"></script>
		<script src="js/bootstrap.js"></script>
		<script src="../../common/jun/yi.shakeit.js"></script>
		<script src="../../common/jun/yi.toast.js"></script>
		<script>
			let getQueryString = function(id) {
				var reg = new RegExp('(^|&)' + id + '=([^&]*)(&|$)', 'i');
				var r = window.location.search.substr(1).match(reg);
				if(r != null) {
					return unescape(r[2]);
				}
				return null;
			};
			const vm = new Vue({
				el: "body>article",
				data: {
					params: {
						key: null,
						result: null
					},
					resp: {
						message: null
					},
					actionBtnDisabled: false
				},
				mounted() {
						axios({
							method: 'get',
							url: `http://127.0.0.1:80/api/bed/${getQueryString('id')}`,
						}).then(resp => {
							this.params = resp.data;
						});
					},
				methods: {	
					"modOne": function() {
						this.actionBtnDisabled = true;
						axios.put(`http://127.0.0.1:80/api/bed/mod/${getQueryString('id')}`, this.params)
							.then(function(resp) {
								if(resp.code === "ok") {
									toast("修改成功！");
									setTimeout(function() {
										location.href = "beds.html";
									}, 3000);

								} else {
									toast(resp.message);
								}
							}).finally(function() {
								vm.actionBtnDisabled = false;
							});
					},
				}
			});
		</script>

	</body>

</html>